<template>
  <c-card>
    <el-form :inline="true" :model="formInline">
      <el-form-item label="任务名称">
        <el-input
            v-model.trim="formInline.title"
            placeholder="请输入任务名称"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="searchHandle">查询</el-button>
        <el-button @click="resetHandle">重置</el-button>
        <el-button type="success" @click="addHandle">新增</el-button>

      </el-form-item>
    </el-form>
  </c-card>
  <c-card>
    <el-table v-loading="isLoading" :data="tableData" stripe highlight-current-row>
      <el-table-column prop="createDate" label="开始日期"/>
      <el-table-column prop="title" label="任务名称"/>
      <el-table-column prop="endDate" label="结束日期"/>
      <el-table-column fixed="right" label="操作">
        <template #default="{row}">
          <el-button link type="primary" @click.stop="updateHandle(row)">编辑</el-button>
          <el-button link type="danger" @click.stop="delHandle(row)">删除</el-button>
          <el-button link type="success" @click.stop="detailHandle(row)">打卡</el-button>
        </template>
      </el-table-column>
    </el-table>
    <c-pagination @page-change="pageChange" :total="pagination.total" :page="pagination.page"
                  :limit="pagination.pageSize"></c-pagination>
  </c-card>
  <add-update ref="addUpdateRef" @ok="getPageList"></add-update>
  <task-detail ref="taskDetailRef"></task-detail>
</template>

<script setup>
import {provide, reactive, ref} from "vue";
import {DEL, GET, POST} from "../../api/index.js";
import {getColorName, messageBox, notify, toStockDetail} from "../../utils/commonScript.js";
import CCard from "../../c-components/c-card.vue";
import CPagination from "../../c-components/c-pagination.vue";
import {useRouter} from "vue-router";
import {typeOptions} from "../../utils/listData.js";
import AddUpdate from "./add-update.vue";
import TaskDetail from "./task-detail.vue";

const router = useRouter()
const tableData = ref([])
const formInline = reactive({
  title: '',
  level: ''
})
const isLoading = ref(false)
const addUpdateRef = ref(null)
const taskDetailRef = ref(null)

const pagination = reactive({
  page: 1,
  pageSize: 10,
  total: 0,
});

const delHandle = (row) => {
  messageBox.confirm(
      `确定要删除 【${row.title}】?`,
      '提示',
      {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }
  )
      .then(() => {
        DEL('/market/task', [row.id]).then(res => {
          notify('删除成功')
          getPageList()
        })
      })
      .catch(() => {

      })

}

const addHandle = () => {
  addUpdateRef.value.open()
}

const updateHandle = (row) => {
  addUpdateRef.value.open(row)
}

const goHandle = ()=> {
  router.push({
    path: '/train'
  })
}
const getLevelName = (level) => {
  return typeOptions.filter(item => item.value === level)[0].label
}

const pageChange = (page, pageSize) => {
  pagination.page = page
  pagination.pageSize = pageSize
  getPageList()
}

// 获取所有股票信息
const getPageList = () => {
  isLoading.value = true
  GET("/market/task/page", {
    title: formInline.title,
    page: pagination.page,
    pageSize: pagination.pageSize,
  }).then(res => {
    tableData.value = res.data.list
    pagination.total = res.data.total
    isLoading.value = false
  }).catch(() => {
    isLoading.value = false
  })

}
getPageList()

const detailHandle = (row) => {
  taskDetailRef.value.open(row)
}

const searchHandle = () => {
  tableData.value = []
  pagination.page = 1
  pagination.pageSize = 10
  pagination.total = 0
  getPageList()
}

const resetHandle = () => {
  formInline.title = ''
  formInline.level = ''
  searchHandle()
}

</script>

<style lang="scss" scoped>
</style>
